<style>
    img.fans-portrait {
        width: 50px;
        height: 50px;
    }

    .sm-rightPanel .layui-table-body .layui-table-cell {
        height: 50px;
        line-height: 50px;
    }
</style>
<div class="sm-rightPanel">
    <div class="layui-anim layui-anim-upbit">
        <div id="list_form" class="layui-form sm-operation">
            <blockquote class="site-text layui-elem-quote">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <input type="text" name="nicknameStr" placeholder="请输入昵称" autocomplete="off" class="layui-input">
                    </div>
                    <div class="layui-inline">
                        <button class="layui-btn" id="search">查询</button>
                    </div>
                    <div class="layui-inline right">
                        <button class="layui-btn btn-danger" id="batch_addtag">批量添加标签</button>
                        <button class="layui-btn btn-danger" id="fans_sync">批量同步粉丝</button>
                    </div>
                </div>
            </blockquote>
        </div>
        <table id="list_table" class="layui-hide" lay-filter="mainList"></table>
    </div>
</div>

<script>
    layui.use(['layer', 'table'], function () {
        var layer = layui.layer;
        var table = layui.table;


        var tableObj = table.render({
            id: 'list_table',
            elem: '#list_table',
            url: '/accountfans/list',
            align: "center",
            cols: [[ //表头
                {type: 'checkbox'},
                {type: 'numbers', title: '序号', width: 50},
                {field: 'nicknameStr', title: '昵称', width: 150, align: 'center'},
                {
                    field: 'headimgurl', title: '头像', width: 80, align: 'center', templet: function (d) {
                    return "<img class='fans-portrait' src=" + d.headimgurl + " />"
                }
                },
                {
                    field: 'gender', title: '性别', width: 70, align: 'center', templet: function (d) {
                    return d.gender == 1 ? '男' : '女';
                }
                },
                {
                    field: 'city', title: '省/市', width: 150, align: 'center', templet: function (d) {
                    return (d.province + '-' + d.city);
                }
                },
                {field: 'subscribeTime', title: '关注时间', width: 180, align: 'center'},
                {
                    field: 'lock', title: '操作', width: 300, align: 'center', templet: function (d) {
                    return '<a href="javascript:;" class="font-primary" lay-event="sync">同步粉丝消息</a>'
//                         + '<a href="javascript:;" class="font-primary" lay-event="mass">发送消息</a>'
                        ;
                }, unresize: true
                }
            ]],
        });

        // 检索
        $("#search").click(function () {
            smartAui.reloadTable(tableObj);
        });

        /* 批量添加标签 -未完成，需要添加页面*/
        $("#batch_addtag").click(function () {
            //选中多个或一个粉丝添加标签
            var data = table.checkStatus('list_table').data;//已选中数据
            console.log(data)
            if (data.length == 0) {
                layer.msg("至少选择一条");
                return;
            }
            var arr = [];     //选中数组
            for (var i = 0; i < data.length; i++) {
                arr.push(data[i].openId)
            }
            smartAui.dialog({
                title: '标签信息',
                template: 'tags',
                width: 755,// 默认宽度,
                height: 600,
                htmlData: arr,
                btn: ["添加", '关闭'],
                yes: function (index, layero) {
                    var seltags = layero.find("#select_tags").val();
                    if (!seltags) {
                        layer.msg("请选择标签！");
                        return;
                    }
                    smartAui.ajax({
                        url: '/userTag/addUserForTag',
                        loading:true,
                        data: {
                            id: seltags,
                            openIds: arr
                        },
                        success: function (result) {
                            if (result.success) {
                                layer.msg("添加成功");
                                layer.close(index);
                            }
                        },
                        error: function () {
                            layer.msg("添加异常");
                        }
                    });
                    //
                },
            });
        });
        // 批量同步粉丝
        $("#fans_sync").click(function () {
            layer.confirm('确认同步粉丝？', {
                icon: 7,
                title: "提示",
                btn: ['确认', '取消'] //按钮
            }, function () {
                smartAui.ajax({
                    loading:true,
                    url: '/wxapi/syncAccountFansList',
                    success: function (result) {
                        if (result.success) {
                            layer.closeAll();
                            layer.msg("同步成功");
                            smartAui.reloadTable(tableObj);
                        } else {
                            layer.msg("同步异常");
                        }
                    },
                    error: function () {
                        layer.msg("同步异常");
                    }
                })
            }, function () {
                layer.closeAll();
            });
        });
        //表格内部操作按钮监听
        table.on('tool(mainList)', function (obj) { //注：tool是工具条事件名，mainList是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值

            if (layEvent === 'mass') {
                smartAui.dialog({
                    title: '发送消息',
                    template: 'msglist',
                    height: 600,
                    tableObj: tableObj,
                    htmlData: data,
                    btn: 0
                })
            }
            // 同步粉丝
            if (layEvent === 'sync') {
                $.ajax({
                    url: '/wxapi/syncAccountFans',
                    data: {openId: data.openId},
                    success: function (result) {
                        if (result.success) {
                            smartAui.dialog({
                                title: '粉丝详细信息'
                                , template: 'fansInfo'
                                , saveUrl: ''
                                , width: 400
                                , height: 500
                                , htmlData: result.data
                                , btn: ["关闭"]
                                , yes: function (index, layero) {
                                    layer.close(index);
                                }
                            })
                        }
                    },
                    error: function () {
                        layer.msg("同步异常");
                    }
                })
            }
        });

    });
</script>
